import { Spin } from 'antd'
import { FC, CSSProperties } from 'react'

export interface baseProps {
  class?: string
  style?: CSSProperties | undefined
  tabIndex?: number
}

export declare type SizeType = 'small' | 'large' | 'default'

/* 
  delay:延迟显示加载的时间
  tip: 提示文案
  wrapperClassName: 包装器的父类组件
*/

export interface spinProps extends baseProps {
  size?: SizeType
  tip?: string
  delay?: number
  wrapperClassName?: string
  children?: React.ReactElement<HTMLElement>
}

export const SpinCmp: FC<spinProps> = props => {
  const { size, tip, delay, wrapperClassName, children, tabIndex, style } = props
  return (
    <div data-index={tabIndex}>
      <Spin
        style={style}
        className={props.class}
        size={size}
        tip={tip}
        delay={delay}
        wrapperClassName={wrapperClassName}
        indicator={children}
      />
    </div>
  )
}
